<template>
	<view class="content">
		<view class="head_bg">
			<view class="userImg">
				<image src="../../../static/sp.png"></image>
			</view>
			<view class="storeName">通泰经销商</view>
			<view class="goldenSpan">金牌门店</view>
			<view class="items">
				<view class="items-box" :class="role==2?'':'store'" @tap="goSelect()">
					<image src="../../../static/images/订单统计@3x.png" mode=""></image>
					<view class="item-box-text">订单统计</view>
				</view>
				<view class="items-box" v-if="role == 2" @tap="goManagement()">
					<image src="../../../static/images/商户管理@3x.png" mode=""></image>
					<view class="item-box-text">商户管理</view>
				</view>
				<view class="items-box" :class="role==2?'':'store'" @tap="QRhuanche()">
					<image src="../../../static/images/用户还车@3x.png" mode=""></image>
					<view class="item-box-text">用户还车</view>
				</view>
			</view>
		</view>
		<view class="tell">
			<view class="left">联系客服</view>
			<view class="right">
				<image src="../../../static/images/more@3x.png"></image>
			</view>
		</view>
		
		<view class="tell" style="margin: 30upx 22upx 0 22upx;" @tap="QRleaseOut()">
			<view class="left">扫码出租</view>
			<view class="right">
				<image src="../../../static/images/more@3x.png"></image>
			</view>
		</view>
	</view>
</template>

<script>
	import config from '@/common/config.js'
	export default {
		data() {
			return {
				titleColor: "#fff",
				apiUrl: config.apiHost,
				banners: [],
				imgUrl: config.ImageUrl,
				role: '',
				userId: uni.getStorageSync('userId'),
				QRCode: ''
			}
		},
		onLoad(option) {
			this.role = option.role
		},
		methods: {
			goSelect(){
				uni.navigateTo({
					url: '../order/orderSelect?role='+this.role
				})
			},
			QRhuanche(){
				let self = this
				uni.scanCode({
					success: function(res) {
						self.QRCode = res.result
						uni.request({
							url: self.apiUrl + '/api/order/scanQRStore',
							method: 'GET',
							contentType: 'application/jason',
							data: {
								carId: self.QRCode,
								state: 3
							},
							success: res => {
								uni.showToast({
									icon:'none',
									title:res.data.msg
								})
							}
						});
					}
				});
			},
			QRleaseOut(){
				let self = this
				uni.scanCode({
					success: function(res) {
						self.QRCode = res.result
						console.log(self.QRCode)
						uni.request({
							url: self.apiUrl + '/api/car/scanQRStoreOut',
							method: 'GET',
							contentType: 'application/jason',
							data: {
								carId: self.QRCode,
								userId: self.userId
							},
							success: res => {
								console.log(res)
								console.log(self.QRCode)
								uni.showToast({
									icon:'none',
									title:res.data.msg
								})
							}
						});
					}
				});
			},
			goManagement(){
				uni.navigateTo({
					url:'../store/storeManagement'
				})
			}
		}
	}
</script>

<style>
	.content {
		width: 100%;
		height: 100%;
	}

	.uni-status-bar {
		display: block;
		width: 100%;
		height: 20px;
		height: var(--status-bar-height);
	}

	.uni-navbar__content {
		display: block;
		position: relative;
		width: 100%;
		background-color: rgba(255, 255, 255, 1);
		overflow: hidden
	}

	.head_bg {
		width: 100%;
		height: 608upx;
		background: rgba(0, 0, 0, 1);
		z-index: -1;
		padding-top: 168upx;
	}

	.head_bg image {
		width: 100%;
		height: 304rpx;
	}

	.userImg {
		width: 166upx;
		height: 166upx;
		margin: 0 auto 28upx auto;
	}

	.userImg image {
		width: 100%;
		height: 100%;
		border-radius: 83upx;
		border: 6upx solid rgba(255, 255, 255, 0.33);
	}

	.storeName {
		width: 100%;
		height: 50upx;
		line-height: 50upx;
		font-size: 36upx;
		color: #FFFFFF;
		text-align: center;
		font-family: PingFangSC-Medium, PingFang SC;
	}
	
	.store {
		width: 50% !important;
	}

	.goldenSpan {
		width: 140upx;
		height: 44upx;
		background: linear-gradient(121deg, rgba(247, 209, 156, 1) 0%, rgba(241, 186, 107, 1) 100%);
		border-radius: 26upx;
		margin: 18upx auto;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 600;
		color: rgba(0, 0, 0, 1);
		line-height: 44upx;
		text-align: center;
	}

	.items {
		margin: 62upx 22upx 20upx 22upx;
		height: 182upx;
		background-color: #FFF;
		display: flex;
		flex-wrap: wrap;
		flex-direction: row;
		border-radius: 12upx;
	}

	.items-box {
		width: 33.3%;
		height: 100%;
		text-align: center;
	}

	.items-box image {
		width: 64upx;
		height: 64upx;
		margin-top: 38upx;
	}

	.item-box-text {
		font-size: 26upx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: rgba(34, 34, 34, 1);
		line-height: 39upx;
	}

	.tell {
		margin: 130upx 22upx 0 22upx;
		height: 110upx;
		background-color: #FFF;
		border-radius: 12upx;
		display: flex;
		flex-wrap: wrap;
	}

	.left {
		width: 50%;
		height: 110upx;
		padding-left: 34upx;
		line-height: 110upx;
		font-size:32upx;
		flex:1;
		font-family:PingFangSC-Regular,PingFang SC;
		font-weight:400;
		color:rgba(46,46,46,1);
	}

	.right {
		width: 50%;
		flex:1;
		height: 110upx;
	}

	.right image {
		float: right;
		width: 50upx;
		height: 50upx;
		right: 34upx;
		top: 30upx;
	}
</style>
